<%@ page contentType="text/html;charset=UTF-8" %>
<%@ include file="/WEB-INF/views/include/taglib.jsp"%>
<html>
<head>
	<title>乐活抢购</title>
	<meta name="decorator" content="default"/>
	<style type="text/css">
		.form-horizontal .control-label {
			float: left;
			width: 120px;
			text-align: right;
		}
		.form-horizontal .controls {
			margin-left: 140px;
		}
	</style>
	<script type="text/javascript">
		$(document).ready(function() {
			$("#name").focus();
			$("#inputForm").validate({
				submitHandler: function(form){
					if($("#logoUrl").val()==""){
						showJBoxMess("请上传活动封面.","error");
						return;
					}
					var num = 0;
					$(".timeslot").each(function(){
						if($(this).css("display")=="block") num++;
					});
					if(num==0){
						showJBoxMess("请添加活动时间","error");
						return;
					}
					loading('正在提交，请稍等...');
					form.submit();
				},
				errorContainer: "#messageBox",
				errorPlacement: function(error, element) {
					$("#messageBox").text("输入有误，请先更正。");
					if (element.is(":checkbox")||element.is(":radio")||element.parent().is(".input-append")){
						error.appendTo(element.parent().parent());
					} else {
						error.insertAfter(element);
					}
				}
			});
		});
		
		function showPhoto(path){
			$("#logoUrl").val(path);
			$("#cutPhoto").css("display", "block");
			var imageSrc = '${ctx}/download?filePath='+path;
			$("#cutPhoto").attr("src", imageSrc);
		}
		
		function delTime(obj, index){
			top.$.jBox.confirm("确认要删除该活动时间吗",'系统提示',function(v,h,f){
				if(v=='ok'){
					$("#delFlag:eq("+index+")").val("1");
					$(obj).parent().hide();
				}
			},{buttonsFocus:1});
		}
		
		//删除已结束的活动
		function delActivityTime(id){
			top.$.jBox.confirm("确认要删除该活动吗",'系统提示',function(v,h,f){
				if(v=='ok'){
					$.ajax({
						type: 'get',
						url: '${ctx}/ivm/business/activity/delActivityTime',
						data: 'timeId='+id,
						dataType: 'json',
						success: function(data){
							if(data.status==200){
								showJBoxMess("删除成功.","success");
								window.location.reload();
							}else{
								showJBoxMess(data.message,"error");
							}
						},
						failure: function(){
							showJBoxMess("操作失败","error");
						}				
					});
				}
			},{buttonsFocus:1});
			top.$('.jbox-body .jbox-icon').css('top','55px');
		}
		
		function addTime(){
			$(".will").removeClass("display-none");
			var num = $(".timeslot").length;
			var html = "<div class=\"timeslot\">";
				html += "<input type=\"hidden\" id=\"timeId\" name=\"timeList["+num+"].id\" value=\"\"/>";
				html += "<input id=\"activityDate"+(num+1)+"\" name=\"timeList["+num+"].activityDate\" type=\"text\" readonly=\"readonly\" maxlength=\"20\" class=\"input-small Wdate required\"";
				html += "value=\"\"";
				html += "onclick=\"WdatePicker({dateFmt:'yyyy-MM-dd',isShowClear:true});\"/>&nbsp;";
				html += "<input id=\"startTime"+(num+1)+"\" name=\"timeList["+num+"].startTime\" type=\"text\" readonly=\"readonly\" maxlength=\"20\" class=\"input-small Wdate required\"";
				html += "value=\"\"";
				html += "onclick=\"WdatePicker({dateFmt:'HH:mm',isShowClear:true,maxDate:'#F{$dp.$D(\\'endTime"+(num+1)+"\\');}'});\"/>";
				html += " ~ ";
				html += "<input id=\"endTime"+(num+1)+"\" name=\"timeList["+num+"].endTime\" type=\"text\" readonly=\"readonly\" maxlength=\"20\" class=\"input-small Wdate required\"";
				html += "value=\"\"";
				html += "onclick=\"WdatePicker({dateFmt:'HH:mm',isShowClear:true,minDate:'#F{$dp.$D(\\'startTime"+(num+1)+"\\');}'});\"/>";
				html += "<input type=\"hidden\" id=\"delFlag\" name=\"timeList["+num+"].delFlag\" value=\"0\" />";
				html += "<input id=\"sort\" name=\"timeList["+num+"].sort\" type=\"hidden\" value=\""+(num+1)+"\" />";
				html += " <a href=\"javascript:\" id=\"arrow-up\" onclick=\"arrowUp(this)\"><i class=\"icon-arrow-up\"></i>上移</a>";
				html += " <a href=\"javascript:\" id=\"arrow-down\" onclick=\"arrowDown(this)\"><i class=\"icon-arrow-down\"></i>下移</a>";
				html += " <input id=\"btnDel\" class=\"btn\" type=\"button\" value=\"删除\" onclick=\"delTime(this, "+num+")\"/>";
				html += "</div>";
			$(".timeslots").append(html);
		}
		//商品编辑
		function setActivityProduct(merchantId, activityId, timeId){
			top.$.jBox.defaults.top="8%";
        	top.$.jBox.open("iframe:${ctx}/ivm/business/activity/productList?merchantId="+merchantId+"&activityId="+activityId+"&timeId="+timeId, "抢购商品列表",$(top.document).width()-350,$(top.document).height()-100,{
				buttons:{"确定":false}, loaded:function(h){
					$(".jbox-content", top.document).css("overflow-y","hidden");
				}
			});
		}
		//商品查看
		function setActivityProductShow(merchantId, activityId, timeId){
			top.$.jBox.defaults.top="8%";
        	top.$.jBox.open("iframe:${ctx}/ivm/business/activity/productListshow?merchantId="+merchantId+"&activityId="+activityId+"&timeId="+timeId, "抢购详情",$(top.document).width()-350,$(top.document).height()-100,{
				buttons:{"确定":true}, loaded:function(h){
					$(".jbox-content", top.document).css("overflow-y","hidden");
				}
			});
		}
	</script>
</head>
<body>
	<!-- <ul class="nav nav-tabs">
		<li><a href="${ctx}/ivm/business/activity/list">活动列表</a></li>
		<li class="active"><a href="${ctx}/ivm/business/activity/form?id=${activity.id}">活动<shiro:hasPermission name="ivm:business:activity:edit">${not empty activity.id?'修改':'添加'}</shiro:hasPermission><shiro:lacksPermission name="ivm:business:activity:edit">查看</shiro:lacksPermission></a></li>
	</ul><br/> -->
	<ul class="nav nav-tabs">
		<li class="active"><a href="${ctx}/ivm/business/activity/form?id=${activity.id}">乐活抢购</a></li>
		<li><a href="${ctx}/ivm/business/discountActivity/form">赠送活动</a></li>
	</ul><br/>
	<form:form id="inputForm" modelAttribute="activity" action="${ctx}/ivm/business/activity/save" method="post" class="form-horizontal">
		<form:hidden path="id"/>
		<input type="hidden" name="type" value="1" />
		<form:hidden path="merchant.id"/>
		<tags:message content="${message}"/>
		<div class="control-group">
			<label class="control-label"><span class="color-red font-size20">*</span>名称:</label>
			<div class="controls">
				<input id="oldName" name="oldName" type="hidden" value="${activity.name}">
				<form:input path="name" htmlEscape="false" maxlength="200" class="required"/>
			</div>
		</div>
		<div class="control-group">
			<label class="control-label">副标题:</label>
			<div class="controls">
				<form:input path="assisTitle" htmlEscape="false" maxlength="15" cssStyle="width: 450px;" class="input-xxlarge measure-input valid"/>
				<br/><span style="color: red;">(提示：不能超过15个字符)</span>
			</div>
		</div>
		<div class="control-group">
			<label class="control-label"><span class="color-red font-size20">*</span>活动封面:</label>
			<div class="controls">
				<form:hidden path="logoUrl" />
				<div class="photo" style="width:149px; height:84px;">
					<c:if test="${activity.logoUrl!=null && activity.logoUrl!=''}">
						<img id="cutPhoto" src="${ctx}/download?filePath=${activity.logoUrl }" style="width:149px; height:84px;" />
					</c:if>
					<c:if test="${activity.logoUrl==null || activity.logoUrl==''}">
						<img id="cutPhoto" src="" style="width:149px; height:84px;" />
					</c:if>
				</div>
				<a href="javascript:" class="btn" id="cutPhotoUpload">上传图片</a>
			</div>
		</div>
		<div class="control-group">
			<label class="control-label"><span class="color-red font-size20">*</span>活动时间:</label>
			<div class="controls">
				<input id="btnAdd" class="btn" type="button" value="添加" onclick="addTime()"/>
			</div>
		</div>
		<div class="control-group will ${!start?'display-none':''}">
			<label class="control-label">即将开始:</label>
			<div class="controls">
				<div class="timeslots">
					<c:forEach items="${activity.timeList}" var="time" varStatus="vs">
						<c:if test="${time.state==1}">
						<div class="timeslot">
							<input type="hidden" id="timeId" name="timeList[${vs.index }].id" value="${time.id }"/>
							<input id="activityDate${vs.index }" name="timeList[${vs.index }].activityDate" type="text" readonly="readonly" maxlength="20" class="input-small Wdate required"
								value="<fmt:formatDate value="${time.activityDate }" pattern="yyyy-MM-dd"/>"
								onclick="WdatePicker({dateFmt:'yyyy-MM-dd',isShowClear:true});"/>
							<input id="startTime${vs.index }" name="timeList[${vs.index }].startTime" type="text" readonly="readonly" maxlength="20" class="input-small Wdate required"
								value="${time.startTime }"
								onclick="WdatePicker({dateFmt:'HH:mm',isShowClear:true,maxDate:'#F{$dp.$D(\'endTime${vs.index }\');}'});"/>
								~
							<input id="endTime${vs.index }" name="timeList[${vs.index }].endTime" type="text" readonly="readonly" maxlength="20" class="input-small Wdate required"
								value="${time.endTime }"
								onclick="WdatePicker({dateFmt:'HH:mm',isShowClear:true,minDate:'#F{$dp.$D(\'startTime${vs.index }\');}'});"/>
							<input type="hidden" id="delFlag" name="timeList[${vs.index }].delFlag" value="${time.delFlag }" />
							<input type="hidden" id="sort" name="timeList[${vs.index }].sort" value="${time.sort }" />
							<a href="javascript:" id="arrow-up" onclick="arrowUp(this)"><i class="icon-arrow-up"></i>上移</a>
							<a href="javascript:" id="arrow-down" onclick="arrowDown(this)"><i class="icon-arrow-down"></i>下移</a>
							<input id="btnDel" class="btn" type="button" value="删除" onclick="delTime(this, ${vs.index })"/>
							<input id="btnSet" class="btn" type="button" value="设置抢购商品" onclick="setActivityProduct('${activity.merchant.id }', '${activity.id}', '${time.id }')"/>
						</div>
						</c:if>
					</c:forEach>
				</div>
			</div>
		</div>
		<c:if test="${starting}">
		<div class="control-group" class="now">
			<label class="control-label">正在进行:</label>
			<div class="controls">
				<c:forEach items="${activity.timeList}" var="time" varStatus="vs">
					<c:if test="${time.state==2}">
					<div class="timeslot">
						<input type="hidden" id="timeId" value="${time.id }"/>
						<input type="text" readonly="readonly" maxlength="20" class="input-small Wdate required"
							value="<fmt:formatDate value="${time.activityDate }" pattern="yyyy-MM-dd"/>"/>
						<input type="text" readonly="readonly" maxlength="20" class="input-small Wdate required"
							value="${time.startTime }"/>
							~
						<input type="text" readonly="readonly" maxlength="20" class="input-small Wdate required"
							value="${time.endTime }"/>
						<label style="width:83px">&nbsp;&nbsp;${time.ratio }%抢完</label>
						<input id="btnSet" class="btn" type="button" value="查看抢购商品" onclick="setActivityProductShow('${activity.merchant.id }', '${activity.id}', '${time.id }')"/>
					</div>
					</c:if>
				</c:forEach>
			</div>
		</div>
		</c:if>
		<c:if test="${started}">
		<div class="control-group" class="over">
			<label class="control-label">已结束:</label>
			<div class="controls">
				<c:forEach items="${activity.timeList}" var="time" varStatus="vs">
					<c:if test="${time.state==3}">
					<div class="timeslot">
						<input type="hidden" id="timeId" value="${time.id }"/>
						<input type="text" readonly="readonly" maxlength="20" class="input-small"
							value="<fmt:formatDate value="${time.activityDate }" pattern="yyyy-MM-dd"/>"/>
						<input type="text" readonly="readonly" maxlength="20" class="input-small"
							value="${time.startTime }"/>
							~
						<input type="text" readonly="readonly" maxlength="20" class="input-small"
							value="${time.endTime }"/>
						<label style="width:90px">&nbsp;&nbsp;${time.ratio }%抢完</label>
						<input id="btnDel" class="btn" type="button" value="删除" onclick="delActivityTime('${time.id }')"/>
						<input id="btnSet" class="btn" type="button" value="查看抢购商品" onclick="setActivityProductShow('${activity.merchant.id }', '${activity.id}', '${time.id }')"/>
					</div>
					</c:if>
				</c:forEach>
			</div>
		</div>
		</c:if>
		<div class="control-group">
			<label class="control-label"><span class="color-red font-size20">*</span>状态:</label>
			<div class="controls">
				<form:radiobuttons path="status" items="${fns:getDictList('roll_status')}" itemLabel="label" itemValue="value" htmlEscape="false" class="required" />
			</div>
		</div>
		<div class="form-actions">
			<shiro:hasPermission name="ivm:business:activity:edit"><input id="btnSubmit" class="btn btn-primary" type="submit" value="保 存"/>&nbsp;</shiro:hasPermission>
			<input id="btnCancel" class="btn" type="button" value="返 回" onclick="history.go(-1)"/>
		</div>
	</form:form>
</body>
</html>
